<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/js/jquery-2.1.1.min.js"></script>

    <script src="/js/jquery-form.js"></script>
    <link rel="stylesheet" href="/js/easyui1.5/themes/icon.css">
    <link rel="stylesheet" href="/js/easyui1.5/themes/default/easyui.css">
    <script src="/js/easyui1.5/jquery.easyui.min.js"></script>

    <script type="text/javascript" th:inline="none">
        $(function () {
            $('#add_div').dialog('close');
            queryStaff();

            setEvent();

            normal2ajax();

        })


        function queryStaff(){
            $("#dg").datagrid({
                url:'/user/queryStaff',
                striped:true,
                pagination:true,
                toolbar:"#gongneng",
                pageList:[1,2,3,4,5,7,10],
                pageSize:5,
                checkOnSelect:false,
                columns:[[
                    {field:'xxx',title:'xx',width:100,checkbox:true},
                    {field:'staffId',title:'id',width:100},
                    {field:'staffName',title:'员工账号',width:100},
                    {field:'staffPwd',title:'员工密码',width:100},
                    {field:'userPhone',title:'员工手机号',width:100},
                    {field:'email',title:'邮箱',width:100},
                    {field:'time',title:'注册时间',width:100},
                    {field:'img',title:'员工图片',width:300,
                        formatter:function(value,row,index){
                            return "<img width='77' src='/js/img/"+value+"'>";
                        }
                    },
                    {field:'xsxs',title:'操作',width:100,
                        formatter:function(value,row,index){

                            var content = " <a href='JavaScript:delStaff("+row.staffId+")' >删除</a> ";
                            content += " <a href='JavaScript:queryStaffById("+row.staffId+")' >修改</a> ";
                            content+=" | <a href='/role/toPower?url=userRole&id="+row.staffId+"' target='_blank' >角色切换</a>";
                            return content;
                        }
                    }
                ]]
            })
        }

        function setEvent(){
            var rows = $("#dg").datagrid("getChecked");
            var ids = "";
            $.each(rows,function(index,obj){
                ids += ids==""?obj.staffId:","+obj.staffId;
            });

            if(ids!=null&&ids!=""){
                delStaff(ids);
            }
        }
 //======删除
        function delStaff(id){
            $.ajax({
                url:"/user/delStaff",
                type:"POST",
                data:{id:id},
                success:function(pageUtil){
                    queryStaff();

                    $.messager.show({
                        title:'消息',
                        msg:'删除成功!!',
                        timeout:5000,
                        showType:'slide'
                    });

                },
                error:function(){
                    alert("失败了");
                }
            });


        }

        /* 修改end */
        /* 提交================================================> start*/
        function normal2ajax(){
            $('#add_form').form({
                url:'/user/addStaff',

                onSubmit: function(){
                },
                success:function(data){

                        closedSubmitData();
                        $("#add_div").dialog("close");
                        $('#dg').datagrid('reload');
                }
            });
        }
        function submitData(){//进行提交表单
            $("#add_form").form('submit')
        }
        function addData(){
            $("#add_div").dialog("open");
            closedSubmitData();
        }
        function closedSubmitData(){
            $('#add_form').form("clear");
        }
//=====修改
        function queryStaffById(id) {

            $("#user-from").form("clear");

            $.ajax({
                url:"/user/queryStaffById",
                type:"POST",
                data:{id:id},
                success:function(result){
                    $('#add_div').dialog('open');
                    $("#add_form").form('load',result);
                },
                error:function(){
                    alert("失败了");
                }
            })
        }

        function poi() {
            var rows = $("#dg").datagrid("getChecked");
            var ids = "";
            $.each(rows,function(index,obj){
                ids += ids==""?obj.staffId:","+obj.staffId;
            });

            if(ids!=null&&ids!=""){

                location.href="/poi/query?ids="+ids;
            }

        }

        function importExcelTest() {

            var file = $('#FileUpload').filebox("getText");
            //判断文件上传是否为空
            if (file == null || file == "") {
                $.messager.alert('系统提示', '请选择将要上传的文件!');
                return;
            }
            //分割文件的类型
            var file_typename = file.substring(file.lastIndexOf('.'), file.length);
            if (file_typename == '.xlsx' || file_typename == '.xls') {
                var options = {
                    method: 'POST',
                    url: '/poi/import',
                    data: file,
                    dataType: 'text',
                    success: function (data) {
                        if (data) {
                            queryStaff();
                            $.messager.show({
                                title: '提示',
                                msg: '用户批量导入成功',
                                showType: 'slide'
                            })
                            $('#FileUpload').filebox("setText", "");

                        } else {
                            //$.messager.alert('警告', '导入异常，请检查是否正确使用模板！')
                            $.messager.alert('提示', data)
                        }
                    }
                }
                $('#testform').ajaxSubmit(options);
            } else {
                $.messager.alert('提示', '请选择正确的文件类型')
            }

        }

    </script>

</head>

<body>

<div id="gongneng">
    <form>
    <a href="JavaScript:void(0)" onclick="setEvent()" class="easyui-linkbutton" data-options="iconCls:'icon-cancel'"></a>

    <a href="JavaScript:void(0)" onclick="addData()" class="easyui-linkbutton" data-options="iconCls:'icon-add'">新增</a>
    <a href="JavaScript:void(0)" onclick="poi()" class="easyui-linkbutton" data-options="iconCls:'icon-undo'"></a>

    <form id="testform" enctype="multipart/form-data" >
        <input id="FileUpload" class="easyui-filebox"  name="file" data-options="prompt:'选择文件....'" />
        <a id="addExcel" class="easyui-linkbutton" data-options="iconCls:'icon-add'" onclick="importExcelTest()">上传</a>
    </form>

</div>
 <table id="dg" fit="true"></table>

<div id="add_div"  class="easyui-dialog" title="员工管理" style="width:600px;height:300px"
     data-options="iconCls:'icon-save',resizable:true,modal:true,
			buttons:[{
				text:'保存',
				iconCls:'icon-ok',
				handler:function(){
					submitData() //调用另一个方法
				}
			},{
				text:'关闭',
				iconCls:'icon-no',
				handler:function(){
				   $('#add_div').dialog('close');
				}
			}]">

    <form id="add_form">
        <input type="hidden" name="staffId">
        <table>
            <tr>
                <td>员工账号</td>
                <td><input name="staffName"></td>
            </tr>
            <tr>
                <td>员工密码</td>
                <td><input name="staffPwd"></td>
            </tr>
            <tr>
                <td>手机号</td>
                <td><input name="userPhone"></td>
            </tr>
            <tr>
                <td>邮箱号</td>
                <td><input name="email"></td>
            </tr>

        </table>
    </form>
</div>
</body>
</html>